﻿@using ETD.Common.Extension;
@using ETD.WebOrganization.Libs.Helper;
@using ETD.WinClient.Config;
@using ETD.Domain.EnumModels;
@using ETD.Domain.WebModels;
@using ETD.Common;
@model ETD.WebOrganization.Areas.Web.Models.HomeModel
<style>
    .money_history_chart {
        height: 280px;
        padding-top: 0px;
    }

    .money_history_chart_topBg {
        height: 40px;
        background-repeat: no-repeat;
        background-size: 100% 100%;
        -moz-background-size: 100% 100%;
    }
</style>
<div class="">

    @Html.PartialAreasWeb("Home/Controls/_MoneySummary", Model.MoneySummary)
    <div class="money_history_chart_topBg" style="background-image:url('@Url.MapMvcAssets("images/money_history_chart.jpg")');"></></div>
    <div class="money_history_chart">
        <div id="container" style="height: 100%"></div>
    </div>

    <div class="weui-grids" style="display:none;">

        <a href="@Url.Action("SelfInfo","SelfCenter")" class="weui-grid js_grid">
            <div class="weui-grid__icon">
                <img src="@Url.MapJqWeuiAssets("images/icon_nav_calendar.png")" alt="">
            </div>
            <p class="weui-grid__label">
                个人信息
            </p>
        </a>
        <a href="@Url.Action("ContactService","SelfCenter")" class="weui-grid js_grid">
            <div class="weui-grid__icon">
                <img src="@Url.MapJqWeuiAssets("images/icon_nav_city.png")" alt="">
            </div>
            <p class="weui-grid__label">
                联系客服
            </p>
        </a>
        <a href="@Url.Action("FinancialIndex","Financial")" class="weui-grid js_grid">
            <div class="weui-grid__icon">
                <img src="@Url.MapJqWeuiAssets("images/icon_nav_datetime.png")" alt="">
            </div>
            <p class="weui-grid__label">
                报修处理
            </p>
        </a>

    </div>


</div>
@section ScriptSection{
    <script>
        $(function () {
            PageObj.init();
        });
        var PageObj = {};
        PageObj.init = function () {
            PageObj.getRecentDaysIncomeList();

        }
        PageObj.onBtnSubmitClick = function () {

        }

        PageObj.submit = function () {
            @*var paras = {};
            paras.FacilityID = $("#txtFacilityID").val();
            paras.Code = $("#txtCode").val().trim();
            paras.PricePerHour = $("#txtPricePerHour").val().trim();
            paras.StartedDate = $("#txtStartedDate").val().trim();
            paras.ZoneNo = $("#txtZoneNo").val().trim();
            paras.Remark = $("#txtRemark").val().trim();
            console.log(JSON.stringify(paras));

            ajaxPost("@Url.Action("FacilityEdit", "Facility")", paras, function (data) {
                console.log(data);
                if (data.Status) {
                    $.toast(data.Info);
                    window.setTimeout(function () { window.location.href = "@Url.Action("FacilityManage", "Facility")"; }, 2000);
                } else {
                    $.toast(data.Info, "forbidden");
                }
            });*@
        }
        PageObj.getRecentDaysIncomeList = function () {
            var paras = {};
            console.log(JSON.stringify(paras));
            ajaxPost("@Url.Action("RecentDaysIncomeList", "Home")", paras, function (data) {
                console.log(data);
                if (data.Status) {
                    PageObj.bindRecentDaysIncomeChart(data);
                } else {
                    $.toast(data.Info, "forbidden");
                }
            });

        }
        PageObj.bindRecentDaysIncomeChart = function (jsonData) {
            var dom = document.getElementById("container");
            var myChart = echarts.init(dom);
            var app = {};
            option = null;
            //var base = +new Date(1968, 9, 3);
            var oneDay = 24 * 3600 * 1000;
            var date = [];

            var data = [];

            for (var i = 1; i < 8; i++) {
                var item = jsonData.Data[i - 1];
                date.push(item.DayText);
                data.push(item.Income);
            }
            console.log(date);
            console.log(data);
            option = {
                tooltip: {
                    trigger: 'axis',
                    position: function (pt) {
                        return [pt[0], '10%'];
                    }
                },
                grid: {
                    top: 0,
                    left: -10,
                    right: 0,
                    //height: 200
                    //x: 40,
                    //x2: 100,
                    //y2: 150// y2可以控制 X轴跟Zoom控件之间的间隔，避免以为倾斜后造成 label重叠到zoom上
                },
                title: {
                    left: 'center',
                    text: '近7天收益',
                    textStyle: { color: '#24d7c2' },

                },
                //toolbox: {
                //    feature: {
                //        dataZoom: {
                //            yAxisIndex: 'none'
                //        },
                //        restore: {},
                //        saveAsImage: {}
                //    }
                //},
                xAxis: {
                    type: 'category',
                    boundaryGap: false,
                    data: date,
                    axisLine: {
                        lineStyle: {
                            color: '#a7e3fd', // 颜色
                            width: 1 // 粗细
                        }
                    },
                    axisLabel: {
                        inside: false,
                        formatter: '{value}',
                        textStyle: {
                            color: '#3cc1fc'
                        }
                    }
                },
                yAxis: {
                    type: 'value',
                    axisTick: {
                        inside: true
                    },
                    splitLine: {
                        show: false
                    },
                    axisLabel: {
                        inside: true,
                        formatter: '  {value}\n',
                        textStyle: {
                            color: '#3cc1fc'
                        }
                    },
                    boundaryGap: [0, '100%']
                },
                //dataZoom: [{
                //    type: 'inside',
                //    start: 0,
                //    end: 10
                //}, {
                //    start: 0,
                //    end: 10,
                //    handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
                //    handleSize: '80%',
                //    handleStyle: {
                //        color: '#fff',
                //        shadowBlur: 3,
                //        shadowColor: 'rgba(0, 0, 0, 0.6)',
                //        shadowOffsetX: 2,
                //        shadowOffsetY: 2
                //    }
                //}],
                series: [
                    {
                        name: '收益',
                        type: 'line',
                        smooth: true,
                        symbol: 'none',
                        sampling: 'average',
                        itemStyle: {
                            //这个颜色是曲线线条的颜色
                            color: '#33b0fb'
                        },
                        areaStyle: {
                            //这个颜色是曲线和X轴 之间的填充渐变色
                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                offset: 0,
                                color: '#a9e7e0'
                            }, {
                                offset: 1,
                                color: '#ebf8fe'
                            }])
                        },
                        data: data
                    }
                ]
            };
            if (option && typeof option === "object") {
                myChart.setOption(option, true);
            }
        }


    </script>
}